<template>
	<view class="engine">

		<view class="enginewrap">
			<view
				style="position: absolute;top:44%;right: 19%;height: 24%;  display: flex;align-items: center;">
				<lightradius v-if="
				            hostRunningStatus(
				              1,
				              allData.left_main?.z131?.currentValue,
				              allData.left_main?.z132?.currentValue
				            ) ||
				            hostRunningStatus(
				              0,
				              allData.left_main?.z131?.currentValue,
				              allData.left_main?.z132?.currentValue
				            )
				          " :isBlinking="false">
				</lightradius>
			</view>
			<view
				style="position: absolute;top:44%;left: 19%;height: 24%;  display: flex;align-items: center;">
				<lightradius v-if="
				            hostRunningStatus(
				              1,
				              allData.right_main?.z231?.currentValue,
				              allData.right_main?.z232?.currentValue
				            ) ||
				            hostRunningStatus(
				              0,
				              allData.right_main?.z231?.currentValue,
				              allData.right_main?.z232?.currentValue
				            )
				          " :isBlinking="false">
				</lightradius>
			</view>
			<view
				style="position: absolute;top:26%;left: 34.5%;width:31%;  display: flex;justify-content: space-between;">
				<lightradius v-if="LightAni(renderValue(2))" :isBlinking="false"></lightradius>
				<lightradius v-if="!LightAni(renderValue(2))" :isBlinking="true" style="visibility: hidden;" ></lightradius>
				<lightradius v-if="LightAni(renderValue(1))" :isBlinking="false"></lightradius>
				<lightradius v-if="!LightAni(renderValue(1))" :isBlinking="true" style="visibility: hidden;" ></lightradius>
				<lightradius v-if="LightAni(renderValue(0))" :isBlinking="false"></lightradius>
				<lightradius v-if="!LightAni(renderValue(0))" :isBlinking="true" style="visibility: hidden;" ></lightradius>
				
			</view>
			<view
				style="position: absolute;bottom:11.2%;left: 18%;width:62.7%; display: flex;justify-content: space-between;">
				<lightradius v-if="Lighthyb(hybData(606, 2, 2))" :isBlinking="false"></lightradius>
				<lightradius v-if="!Lighthyb(hybData(606, 2, 2))" :isBlinking="true" style="visibility: hidden;"></lightradius>
				<lightradius v-if="Lighthyb(hybData(606, 1, 2))" :isBlinking="false" style="margin-left: 7%;"></lightradius>
				<lightradius v-if="!Lighthyb(hybData(606, 1, 2))" :isBlinking="true" style="margin-left: 7%;visibility: hidden;;"></lightradius>
				<lightradius v-if="Lighthyb(hybData(606, 0, 2))" :isBlinking="false"></lightradius>
				<lightradius v-if="!Lighthyb(hybData(606, 0, 2))" :isBlinking="true" style="visibility: hidden;"></lightradius>
			</view>
		</view>
		<view class="btn">
			<u-button type="success" text="配电板"  @click="routerPush(`/pages/equipment/main?props=${3}&id=${4}`)"></u-button>
			<u-button type="warning " text="发电机组" @click="routerPush(`/pages/equipment/main?props=${3}&id=${5}`)"></u-button>
			<u-button type="primary" text="左主机" @click="routerPush(`/pages/equipment/main?props=${0}&id=${0}`)"></u-button>
			<u-button type="error" text="右主机" @click="routerPush(`/pages/equipment/main?props=${1}&id=${1}`)"></u-button>
		</view>
	</view>
	
</template>

<script setup>
	import lightradius from "@/components/lightradius.vue"
	import {
		initDecimalPlaces
	} from "@/utils/utils.js";
	import {
		inject,
		ref,
		computed,
		watch
	} from "vue";
	import { routerPush } from "@/plugins/index.js";
	let allData = inject("allData");
	let powerListDate = ref([]);
	let hyb = ref([{
			text: `1#货油泵`,
			num: 8,
			sort: 601,
			time: "z607"
		},
		{
			text: `2#货油泵`,
			num: 8,
			sort: 609,
			time: "z615"
		},
		{
			text: `3#货油泵}`,
			num: 8,
			sort: 617,
			time: "z623"
		},
	]);
	let pumpDataList = ref(null);
	let hybData = computed(() => {
		return (sort, index, n) => {
			let sorts = "z" + (sort + index * 8);
			if (!pumpDataList.value) return initDecimalPlaces(n);
			return pumpDataList?.value[sorts]?.currentValue || initDecimalPlaces(n);
		};
	});
	const Lighthyb = computed(() => {
		return (value) => {
			return value > 3 ? true : false;
		};
	});
	watch(
		() => allData.value,
		(newVal, oldVal) => {
			let pumpInitData = newVal.hyb || {};
			pumpDataList.value = pumpInitData;
		}, {
			deep: true,
		}
	);
	watch(
		() => allData.value,
		(newVal, oldVal) => {
			powerListDate.value[0] = newVal.power1;
			powerListDate.value[1] = newVal.power2;
			powerListDate.value[2] = newVal.power3;
		}, {
			deep: true,
		}
	);

	let LightAni = computed(() => {
		return (zjVal) => {
			if (zjVal > 1650) return true; //超速
			if (zjVal >= 250) return true; //运行
			if (zjVal < 250) return false; // 停机
		};
	});
	let renderValue = computed(() => {
		return (index) => {
			let key = "z" + (301 + 16 * index);
			let value = powerListDate.value[index]?.[key]?.currentValue || 0;
			return value;
		};
	});
	// 开机转态
	const hostRunningStatus = computed(() => {
		return (str, zc, dc) => {
			let point = 10;
			let zcValue = zc ?? 0;
			let dcValue = dc ?? 0;
			if (zcValue < point && zcValue < point) return 0;
			if (!str) {
				// 倒车
				if (dcValue >= point) return 2;
				else return 0;
			} else {
			
				if (zcValue >= point) return 3;
				else return 0;
				// 正车
			}
		};
	});
</script>

<style scoped lang="scss">
	.engine {
		background-color: rgb(45, 73, 97);
		color: rgb(64, 158, 255);
		padding: 10rpx 10rpx;
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		display: flex;
		flex-direction: column;

		.enginewrap {
			position: relative;
			margin: 0 auto;
			width: 80%;
			height: 60%;
			margin-top: 200rpx;
			background: url('@/static/lj.png') no-repeat;
			background-size: 100% 100%;
			background-position: center center;
		}

		.btn {
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		display: flex;
		justify-content: center;
		padding: 10rpx;

			&>* {
				margin: 0 20rpx;
			}
		}
	}
</style>